﻿//var ldata = [{}];
var w = new Array("日", "一", "二", "三", "四", "五", "六");
var shiChen = new Array("【子时】夜半", "【丑时】鸡鸣", "【丑时】鸡鸣", "【寅时】平旦", "【寅时】平旦", "【卯时】日出", "【卯时】日出", "【辰时】食时", "【辰时】食时", "【巳时】隅中", "【巳时】隅中", "【午时】日中", "【午时】日中", "【未时】日昳", "【未时】日昳", "【申时】哺时", "【申时】哺时", "【酉时】日入", "【酉时】日入", "【戌时】黄昏", "【戌时】黄昏", "【亥时】人定", "【亥时】人定", "【子时】夜半");
var sc = ['子', '丑', '寅', '卯', '辰', '巳', '午', '未', '申', '酉', '戌', '亥'];
var tianGan=['癸',    '甲', '乙', '丙', '丁', '戊', '已', '庚', '辛', '壬'];
var diZhi=['亥',      '子', '丑', '寅', '卯', '辰', '巳', '午', '未', '申', '酉', '戌'];
var shengXiao=['猪',  '鼠 ', '牛 ', '虎 ', '兔 ', '龙 ', '蛇 ', '马 ', '羊 ', '猴 ', '鸡 ', '狗 '];

function roundDatas(num) {
    var datas = [];
    for (var i = 0; i < num; i++) {
        var x = Math.cos(30 * i * Math.PI / 180);
        var y = Math.sin(30 * i * Math.PI / 180);
        datas.push({
            name: i,
            x: y,
            y: -x
        });
    }
    return datas;
}


function roundDatas1(num) {
    var datas = [];
    for (var i = 0; i < num; i++) {
        var x = Math.cos(6 * i * Math.PI / 180);
        var y = Math.sin(6 * i * Math.PI / 180);
        datas.push({
            name: i,
            x: y,
            y: -x
        });
    }
    return datas;
}

function roundDatas2(num) {
    var datas = [];
    for (var i = 0; i < num; i++) {
        var x = Math.cos(30 * i * Math.PI / 180);
        var y = Math.sin(30 * i * Math.PI / 180);
        datas.push({
            name: sc[i],
            x: y,
            y: -x
        });
    }
    return datas;
}

function linkDatas(num) {
    var ldatas = [];
    for (var i = 0; i < num; i++) {
        ldatas.push({
            source: i,
            target: i + 1
        });
    }
    ldatas.push({
        source: (i - 1),
        target: 0
    });
    return ldatas;
}

function arrIndex(arr, a) {
    for (var l = 0; l < arr.length; l++) {
        if (arr[l] == a.charAt(1)) {
            return l;
        }
    }
}

option53 = {
    backgroundColor: '#000000',
    title: {
        text: '',
        subtext: '',
        left: 50,
        top: 10,
        backgroundColor: '#ECECFF',
        borderRadius: 8,
        textStyle: {
            color: '#2828FF',
        },
        subtextStyle: {
            color: '#2894FF',
        }
    },

    legend: {
        x: '280',
        top: '10%',
        itemGap: 20,
        borderColor: '#6495ED',
        borderRadius: [5, 5, 5, 5],
        shadowColor: 'rgba(0, 245, 255, 0.8)',
        shadowBlur: 10,
        shadowOffsetX: 8,
        shadowOffsetY: -6,
        borderWidth: 1,
        selectedMode: false,
        textStyle: {
            //color: '#102b6a',
            color: '#00CACA'
        },
        data: ['时', '分', '秒', '时辰']
    },
    series: [

        {
            name: '时',
            type: 'graph',
            roam: true,
            draggable: true,
            itemStyle: {
                normal: {
                    color: '#694d9f'
                }
            },
            lineStyle: {
                normal: {
                    color: '#694d9f',
                    curveness: 1,
                    opacity: 0.1
                }
            },

            symbol: 'circle',
            symbolSize: 2,
            top: '225',
            left: '300',
            width: '100',
            height: '100',
            data: roundDatas(12),
            links: linkDatas(12)
        },

        {
            name: '分',
            type: 'graph',
            roam: true,
            itemStyle: {
                normal: {
                    color: '#2585a6'
                }
            },
            lineStyle: {
                normal: {
                    color: '#2585a6',
                    curveness: 1,
                    opacity: 0.1
                }
            },

            symbol: 'circle',
            symbolSize: 2,
            top: '168',
            left: '250',
            width: '200',
            height: '200',
            data: roundDatas1(60),
            links: linkDatas(60)
        }, {
            name: '秒',
            type: 'graph',
            roam: true,
            itemStyle: {
                normal: {
                    color: '#f173ac'
                }
            },
            lineStyle: {
                normal: {
                    color: '#f173ac',
                    curveness: 1,
                    opacity: 0.1
                }
            },

            symbol: 'circle',
            symbolSize: 2,
            top: '120',
            left: '200',
            width: '300',
            height: '300',
            data: roundDatas1(60),
            links: linkDatas(60)
        },


        {
            name: '时辰',
            type: 'graph',
            roam: true,
            draggable: true,
            itemStyle: {
                normal: {
                    color: '#94d6da'
                }
            },
            label: {
                normal: {
                    show: true,
                    formatter: '{b}',
                    fontSize: 15,
                    textBorderColor: '#94d6da',
                    textBorderWidth: 1

                }
            },
            lineStyle: {
                normal: {
                    color: '#694d9f',
                    curveness: 1,
                    opacity: 0.1
                }
            },

            symbol: 'circle',
            symbolSize: 2,
            top: '200',
            left: '540',
            width: '100',
            height: '100',
            data: roundDatas2(12),
            links: linkDatas(12)
        },


    ]
};


function start() {
    myChart.setOption(option);
    var dt = new Date();
    var year = dt.getFullYear();
    var month = dt.getMonth() + 1;
    var week = dt.getDay();
    var day = dt.getDate();
    var h = dt.getHours();
    var m = dt.getMinutes();
    var s = dt.getSeconds();
    var xs = Math.cos(6 * s * Math.PI / 180);
    var ys = Math.sin(6 * s * Math.PI / 180);
    var xm = Math.cos(6 * m * Math.PI / 180);
    var ym = Math.sin(6 * m * Math.PI / 180);
    var en = h;
    if (h > 12) {
        h = h - 12;
    }
    var xh = Math.cos(30 * h * Math.PI / 180);
    var yh = Math.sin(30 * h * Math.PI / 180);
    var en1 = arrIndex(sc, shiChen[en]);
    var tG=tianGan[(year-3)%10];
    var dZ=diZhi[(year-3)%12];
    var sX=shengXiao[(year-3)%12];


    for (var j = 0; j < s; j++) {
        var x1 = Math.cos(6 * j * Math.PI / 180);
        var y1 = Math.sin(6 * j * Math.PI / 180);
        option.series[2].data[j] = {
            name: j,
            symbol: 'arrow',
            symbolSize: 1,
            x: y1,
            y: -x1
        };
    }
    for (var j = 59; j > s; j--) {
        var x1 = Math.cos(6 * j * Math.PI / 180);
        var y1 = Math.sin(6 * j * Math.PI / 180);
        option.series[2].data[j] = {
            name: j,
            symbol: 'arrow',
            symbolSize: 5,
            x: y1,
            y: -x1
        };
    }
    //秒


    for (var j = 0; j < m; j++) {
        var x1 = Math.cos(6 * j * Math.PI / 180);
        var y1 = Math.sin(6 * j * Math.PI / 180);
        option.series[1].data[j] = {
            name: j,
            symbol: 'arrow',
            symbolSize: 5,
            x: y1,
            y: -x1
        };
    }
    for (var j = 59; j > m; j--) {
        var x1 = Math.cos(6 * j * Math.PI / 180);
        var y1 = Math.sin(6 * j * Math.PI / 180);
        option.series[1].data[j] = {
            name: j,
            symbol: 'arrow',
            symbolSize: 1,
            x: y1,
            y: -x1
        };
    } //分


    for (var j = 0; j < h; j++) {
        var x1 = Math.cos(30 * j * Math.PI / 180);
        var y1 = Math.sin(30 * j * Math.PI / 180);
        option.series[0].data[j] = {
            name: j,
            symbol: 'arrow',
            symbolSize: 5,
            x: y1,
            y: -x1
        };
    }
    for (var j = 12; j > h; j--) {
        var x1 = Math.cos(30 * j * Math.PI / 180);
        var y1 = Math.sin(30 * j * Math.PI / 180);
        option.series[0].data[j] = {
            name: j,
            symbol: 'arrow',
            symbolSize: 1,
            x: y1,
            y: -x1
        };
    } //时

    for (var j = 0; j < en1; j++) {
        option.series[3].data[j] = {
            name: sc[j],
            x: Math.sin(30 * j * Math.PI / 180),
            y: -Math.cos(30 * j * Math.PI / 180),
            label: {
                normal: {
                    show: true,
                    formatter: '{b}',
                    fontSize: 15,
                    textBorderColor: '#94d6da',
                    textBorderWidth: 1

                }
            }
        }
    } //时辰

    /////////////////////////////////////////////////////////////

    option.series[2].data[s] = {
        name: s,
        //symbolSize: 20,
        x: ys,
        y: -xs,
        itemStyle: {
            normal: {
                color: '#f173ac'
            }
        },
        label: {
            normal: {
                show: true,
                formatter: '{b}',
                fontSize: 18,
                textBorderColor: '#f173ac',
                textBorderWidth: 3

            }
        }
    };
    if (s == 0) {
        option.series[2].data[0] = {
            name: '0',
            //symbolSize: 20,
            x: ys,
            y: -xs,
            label: {
                normal: {
                    show: true,
                    formatter: '0',
                    fontSize: 18,
                    textBorderColor: '#f173ac',
                    textBorderWidth: 3

                }
            }
        }
    }; //秒

    option.series[1].data[m] = {
        name: m,
        //symbolSize: 25,
        x: ym,
        y: -xm,
        itemStyle: {
            normal: {
                color: '#2585a6'
            }
        },
        label: {
            normal: {
                show: true,
                formatter: '{b}',
                fontSize: 20,
                textBorderColor: '#2585a6',
                textBorderWidth: 3

            }
        }
    };
    if (m == 0) {
        option.series[1].data[0] = {
            name: '0',
            //symbolSize: 25,
            x: ym,
            y: -xm,
            label: {
                normal: {
                    show: true,
                    formatter: '0',
                    fontSize: 20,
                    textBorderColor: '#2585a6',
                    textBorderWidth: 3

                }
            }
        }
    } //分

    option.series[0].data[h] = {
        name: h,
        //symbolSize: 30,
        x: yh,
        y: -xh,
        itemStyle: {
            normal: {
                color: '#694d9f'
            }
        },
        label: {
            normal: {
                show: true,
                formatter: '{b}',
                fontSize: 28,
                textBorderColor: '#694d9f',
                textBorderWidth: 5

            }
        }
    };
    if (h == 0) {
        option.series[0].data[0] = {
            name: '0',
            //symbolSize: 30,
            x: yh,
            y: -xh,
            label: {
                normal: {
                    show: true,
                    formatter: '0',
                    fontSize: 28,
                    textBorderColor: '#694d9f',
                    textBorderWidth: 5

                }
            }
        }
    } //时


    option.series[3].data[en1] = {
        name: sc[en1],
        x: Math.sin(30 * en1 * Math.PI / 180),
        y: -Math.cos(30 * en1 * Math.PI / 180),
        label: {
            normal: {
                show: true,
                formatter: '{b}',
                fontSize: 15,
                textBorderColor: '#f58220',
                textBorderWidth: 2

            }
        }
    } //时辰

    option.title.text = year + '年' + month + '月' + day + '日';
    option.title.subtext = '星期' + w[week] + ' ' + shiChen[en]+'\n'+tG+dZ+'年'+'【'+sX+'年】';
//正确干支纪年，生肖是按农历年算的.
    setTimeout(start, 100);

}

start();
